<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>展示页面</title>
</head>

<body>
  <div class="bck">
    <div class="yuan_bck">
      原视频
      <video src="./img/36458cabade78eaefe1a9c9201d82de1.mp4" alt="" controls>
    </div>
    <div class="feng_bck">
      处理后视频
      <video src="./img/36458cabade78eaefe1a9c9201d82de1.mp4" alt="" controls>
    </div>
    <div class="sure">确定</div>
  </div>
</body>
<script>
  // var video = window.location.search.split('=')[1]
  // var yuantu_dizhi = "D:\\code1\\UnetPP\\xitong\\templates\\shipin_FenGe\\" + video
  // var jieguo_dizhi = "D:\\code1\\UnetPP\\xitong\\templates\\shipin_JieGuo\\" + video
  // var videos = document.querySelectorAll('video');
  // var sure = document.querySelector('.sure')
  // console.log('图片地址' + video);
  // console.log('原图地址' + yuantu_dizhi);
  // console.log('结果地址' + jieguo_dizhi);
  // console.log('imgs' + videos);
  // change1()
  // change2()
  // sure.onclick = function () {
  //   window.location.href = './01_初版.html'
  // }
  // function change1() {
  //   videos[0].setAttribute("src", yuantu_dizhi)
  // }
  // function change2() {
  //   videos[1].setAttribute("src", jieguo_dizhi)
  // }
</script>
<style>
  video {
    width: 400px;
    height: 500px;
  }

  .bck {
    width: 100%;
    height: 900px;
    background: url('./img/bck.png');
    background-size: cover;
    display: flex;
  }

  .yuan_bck {
    margin-top: 100px;
    margin-left: 300px;
    width: 400px;
    height: 500px;
    float: 1;
    text-align: center;
    font-size: 20px;
    color: azure;
    background-color: rgb(12, 174, 223, .1);
    position: relative;
  }

  .feng_bck {
    margin-top: 100px;
    margin-left: 100px;
    width: 400px;
    height: 500px;
    float: 1;
    text-align: center;
    font-size: 20px;
    color: azure;
    background-color: rgb(12, 174, 223, .1);
    position: relative;
  }

  .yuan_bck img {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .feng_bck img {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .sure {
    width: 200px;
    height: 50px;
    position: absolute;
    margin-left: 650px;
    margin-top: 650px;
    text-align: center;
    line-height: 50px;
    background-color: rgba(16, 233, 204, 0.8);
  }
</style>

</html>